/*
* 登录界面路由页面*/

import React,{Component} from "react";
import {
    NavBar,
    WingBlank,
    List,
    InputItem,
    WhiteSpace,
    Button,
    Toast

} from "antd-mobile"
import {Redirect} from "react-router-dom";
import {connect} from 'react-redux'

import {login} from "../../redux/actions";

import Logo from "../../components/logo/logo"

const ListItem = List.Item
class Login extends Component{
    state ={
        username:'',
        password:''
    }
    //装到注册按钮
    toRegister=()=>{
        this.props.history.replace('/register')
    }
    //登录按钮
    Login=()=>{
        this.props.login(this.state)
        //Toast.success('登录成功')
        //console.log(this.state)
    }
    //处理输入数据的改变，更新对应的状态
    handleChange=(name,value)=>{

        //更新状态
        this.setState({
            [name]:value
        })
    }
    render() {
        const {redirectTo,msg} = this.props
        if (redirectTo){
            return <Redirect to ={redirectTo}></Redirect>
        }
        return(
            <div>
                <NavBar>招 聘</NavBar>
                <Logo></Logo>
                <WingBlank>
                    {msg==""? null:<p className="error-msg">{msg}</p>}
                    <List >
                        <InputItem onChange={value => {this.handleChange('username',value)}}>用户名：</InputItem>
                        <WhiteSpace> </WhiteSpace>
                        <InputItem type='password' onChange={value => {this.handleChange('password',value)}}>密 &nbsp;&nbsp;码：</InputItem>
                        <WhiteSpace> </WhiteSpace>
                        <Button type='primary' onClick={this.Login}>登录</Button>
                        <WhiteSpace> </WhiteSpace>
                        <Button onClick={this.toRegister}>还没有账号</Button>
                    </List>
                </WingBlank>
            </div>
        )
    }
}

export default connect(
    state=>state.user,
    {login}
)(Login)